<html>

<head>
  <title>Test updating of accessible relations</title>
  <link rel="stylesheet" type="text/css"
        href="chrome://mochikit/content/tests/SimpleTest/test.css" />

  <script type="application/javascript"
          src="chrome://mochikit/content/tests/SimpleTest/SimpleTest.js"></script>

  <script type="application/javascript"
          src="../common.js"></script>
  <script type="application/javascript"
          src="../relations.js"></script>
  <script type="application/javascript"
          src="../role.js"></script>
  <script type="application/javascript"
          src="../events.js"></script>

  <script type="application/javascript">
    function testRelated(aRelAttr, aHostRelation, aDependentRelation,
                         aHostID, aHostNodeID, aDependent1ID, aDependent2ID)
    {
      // no attribute
      testRelation(aDependent1ID, aDependentRelation, null);
      testRelation(aDependent2ID, aDependentRelation, null);
      if (aHostRelation)
        testRelation(aHostID, aHostRelation, null);

      // set attribute
      getNode(aHostNodeID).setAttribute(aRelAttr, aDependent1ID);
      testRelation(aDependent1ID, aDependentRelation, aHostID);
      testRelation(aDependent2ID, aDependentRelation, null);
      if (aHostRelation)
        testRelation(aHostID, aHostRelation, aDependent1ID);

      // change attribute
      getNode(aHostNodeID).setAttribute(aRelAttr, aDependent2ID);
      testRelation(aDependent1ID, aDependentRelation, null);
      testRelation(aDependent2ID, aDependentRelation, aHostID);
      if (aHostRelation)
        testRelation(aHostID, aHostRelation, aDependent2ID);

      // remove attribute
      getNode(aHostNodeID).removeAttribute(aRelAttr);
      testRelation(aDependent1ID, aDependentRelation, null);
      testRelation(aDependent2ID, aDependentRelation, null);
      if (aHostRelation)
        testRelation(aHostID, aHostRelation, null);
    }

    function insertRelated(aHostRelAttr, aDependentID, aInsertHostFirst,
                           aHostRelation, aDependentRelation)
    {
      this.eventSeq = [
        new invokerChecker(EVENT_REORDER, document)
      ];

      this.invoke = function insertRelated_invoke()
      {
        this.hostNode = document.createElement("div");
        this.hostNode.setAttribute(aHostRelAttr, aDependentID);

        this.dependentNode = document.createElement("div");
        this.dependentNode.setAttribute("id", aDependentID);

        if (aInsertHostFirst) {
          document.body.appendChild(this.hostNode);
          document.body.appendChild(this.dependentNode);
        } else {
          document.body.appendChild(this.dependentNode);
          document.body.appendChild(this.hostNode);
        }
      }

      this.finalCheck = function insertRelated_finalCheck()
      {
        testRelation(this.dependentNode, aDependentRelation, this.hostNode);
        if (aHostRelation)
          testRelation(this.hostNode, aHostRelation, this.dependentNode);
      }

      this.getID = function insertRelated_getID()
      {
        return "Insert " + aHostRelAttr + "='" + aDependentID + "' node" +
          (aInsertHostFirst ? " before" : "after") + " dependent node";
      }
    }

    /**
     * Relative accessible recreation shouldn't break accessible relations.
     * Note: modify this case if the invoke function doesn't change accessible
     * tree due to changes in layout module. It can be changed on any case
     * when accessibles are recreated.
     */
    function recreateRelatives(aContainerID, aLabelID, aElmID)
    {
      this.containerNode = getNode(aContainerID);
      this.container = getNode(this.containerNode);

      this.eventSeq = [
        new invokerChecker(EVENT_HIDE, this.container),
        new invokerChecker(EVENT_SHOW, this.containerNode)
      ];

      this.invoke = function recreateRelatives_invoke()
      {
        testRelation(aLabelID, RELATION_LABEL_FOR, aElmID);
        testRelation(aElmID, RELATION_LABELLED_BY, aLabelID);

        this.containerNode.style.overflow = "visible";
      }

      this.finalCheck = function recreateRelatives_finalCheck()
      {
        testRelation(aLabelID, RELATION_LABEL_FOR, aElmID);
        testRelation(aElmID, RELATION_LABELLED_BY, aLabelID);
      }

      this.getID = function recreateRelatives_getID()
      {
        return "recreate relatives ";
      }
    }

    //gA11yEventDumpToConsole = true; // debug

    var gQueue = null;

    function doTest()
    {
      // Relation updates on ARIA attribute changes.
      testRelated("aria-labelledby",
                  RELATION_LABELLED_BY, RELATION_LABEL_FOR,
                  "host", "host", "dependent1", "dependent2");

      testRelated("aria-describedby",
                  RELATION_DESCRIBED_BY, RELATION_DESCRIPTION_FOR,
                  "host", "host", "dependent1", "dependent2");

      testRelated("aria-controls",
                  RELATION_CONTROLLER_FOR, RELATION_CONTROLLED_BY,
                  "host", "host", "dependent1", "dependent2");

      testRelated("aria-flowto",
                  RELATION_FLOWS_TO, RELATION_FLOWS_FROM,
                  "host", "host", "dependent1", "dependent2");

      // Document relation updates on ARIA attribute change.
      testRelated("aria-labelledby",
                  RELATION_LABELLED_BY, RELATION_LABEL_FOR,
                  document, "body", "dependent1", "dependent2");

      // Insert related accessibles into tree.
      gQueue = new eventQueue();
      gQueue.push(new insertRelated("aria-labelledby", "dependent3", true,
                                    RELATION_LABELLED_BY, RELATION_LABEL_FOR));
      gQueue.push(new insertRelated("aria-labelledby", "dependent4", false,
                                    RELATION_LABELLED_BY, RELATION_LABEL_FOR));

      gQueue.push(new insertRelated("aria-describedby", "dependent5", true,
                                    RELATION_DESCRIBED_BY,
                                    RELATION_DESCRIPTION_FOR));
      gQueue.push(new insertRelated("aria-describedby", "dependent6", false,
                                    RELATION_DESCRIBED_BY,
                                    RELATION_DESCRIPTION_FOR));

      gQueue.push(new insertRelated("aria-controls", "dependent9", true,
                                    RELATION_CONTROLLER_FOR,
                                    RELATION_CONTROLLED_BY));
      gQueue.push(new insertRelated("aria-controls", "dependent10", false,
                                    RELATION_CONTROLLER_FOR,
                                    RELATION_CONTROLLED_BY));

      gQueue.push(new insertRelated("aria-flowto", "dependent11", true,
                                    RELATION_FLOWS_TO, RELATION_FLOWS_FROM));
      gQueue.push(new insertRelated("aria-flowto", "dependent12", false,
                                    RELATION_FLOWS_TO, RELATION_FLOWS_FROM));

      // Update relations when accessibles are recreated
      gQueue.push(new recreateRelatives("container", "label", "input"));

      gQueue.invoke(); // will call SimpleTest.finish()

    }

    SimpleTest.waitForExplicitFinish();
    addA11yLoadEvent(doTest);
  </script>

</head>

<body id="body">

  <a target="_blank"
     href="https://bugzilla.mozilla.org/show_bug.cgi?id=573469"
     title="Cache relations defined by ARIA attributes">
    Mozilla Bug 573469
  </a>
  <a target="_blank"
     href="https://bugzilla.mozilla.org/show_bug.cgi?id=631068"
     title="Accessible recreation breaks relations">
    Mozilla Bug 631068
  </a>
  <a target="_blank"
     href="https://bugzilla.mozilla.org/show_bug.cgi?id=635346"
     title="Allow relations for document defined on document content">
    Mozilla Bug 635346
  </a>
  <br>
  <p id="display"></p>
  <div id="content" style="display: none"></div>
  <pre id="test">
  </pre>

  <div id="dependent1">label</div>
  <div id="dependent2">label2</div>
  <div role="checkbox" id="host"></div>

  <form id="container" style="overflow: hidden;">
    <label for="input" id="label">label</label>
    <input id="input">
  </form>
</body>
</html>
